<template>
    <div class="app-container">
        <el-form ref="form" :model="form" inline label-width="140px">
            <el-form-item label="开始报名日期" label-width="100px">
                <el-date-picker size="small" value-format="yyyy-MM-dd" v-model="form.region" type="date" placeholder="选择日期">
                </el-date-picker>
            </el-form-item>

            <el-form-item label="结束报名日期">
                <el-date-picker size="small" value-format="yyyy-MM-dd" v-model="form.region" type="date" placeholder="选择日期">
                </el-date-picker>
            </el-form-item>


            <el-form-item label="姓名" size="small">
                <el-input v-model="form.name"></el-input>
            </el-form-item>

            <el-form-item label="身份证号" size="small">
                <el-input v-model="form.name"></el-input>
            </el-form-item>

            <el-form-item label="教练" size="small" label-width="100px">
                <el-input v-model="form.name"></el-input>
            </el-form-item>

            <el-form-item label="车型" size="small" label-width="100px">
                <el-input v-model="form.name"></el-input>
            </el-form-item>


            <el-form-item label="是否打过学时" size="small">
                <el-select v-model="value" placeholder="请选择">
                    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                    </el-option>
                </el-select>
            </el-form-item>

            <el-form-item label="进度" size="small">
                <el-select v-model="value" placeholder="请选择">
                    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                    </el-option>
                </el-select>
            </el-form-item>

            <el-form-item label="挂靠点" size="small">
                <el-input v-model="form.name"></el-input>
            </el-form-item>

            <el-form-item label="招生人" size="small" label-width="100px">
                <el-input v-model="form.name"></el-input>
            </el-form-item>

            <el-form-item label=" " size="small" label-width="0px">
                <el-checkbox v-model="checked">科一</el-checkbox>
                <el-checkbox v-model="checked">科二</el-checkbox>
                <el-checkbox v-model="checked">科三</el-checkbox>
                <el-checkbox v-model="checked">科四</el-checkbox>
            </el-form-item>
            <el-form-item label=" " size="small" label-width="0px">
                <el-button type="primary" size="small">查询</el-button>
                <el-button type="info" plain size="small">导出</el-button>
            </el-form-item>
        </el-form>

        <div class="mt-1" style="height: 590px;">
            <el-table :data="tableData" border height="100%">
                <el-table-column prop="id" label="ID" width="80" align="center">
                </el-table-column>
                <el-table-column prop="name" label="姓名" width="120" align="center">
                </el-table-column>
                <el-table-column prop="sex" label="性别" width="80" align="center">
                </el-table-column>
                <el-table-column prop="idcard" label="身份证号" width="200" align="center">
                </el-table-column>
                <el-table-column prop="time" label="报名日期" width="150" align="center">
                </el-table-column>
                <el-table-column prop="car" label="车型" width="100" align="center">
                </el-table-column>
                <el-table-column prop="zlzx" label="资料走向" width="120" align="center">
                </el-table-column>
                <el-table-column prop="tel" label="手机号" width="120" align="center">
                </el-table-column>
                <el-table-column prop="com_name_" label="进度" width="120" align="center">
                </el-table-column>
                <el-table-column prop="com_name_" label="挂靠点" width="120" align="center">
                </el-table-column>
                <el-table-column prop="leader" label="教练" width="120" align="center">
                </el-table-column>
                <el-table-column prop="k1" label="科一" width="120" align="center">
                </el-table-column>
                <el-table-column prop="k2" label="科二" width="120" align="center">
                </el-table-column>
                <el-table-column prop="k3" label="科三" width="120" align="center">
                </el-table-column>
                <el-table-column prop="k4" label="科四" width="120" align="center">
                </el-table-column>
                <el-table-column prop="k1xs" label="科一学时" width="120" align="center">
                </el-table-column>
                <el-table-column prop="k2xs" label="科二学时" width="120" align="center">
                </el-table-column>
                <el-table-column prop="k3xs" label="科三学时" width="120" align="center">
                </el-table-column>
                <el-table-column prop="k4xs" label="科四学时" width="120" align="center">
                </el-table-column>
                <el-table-column prop="k2mnxs" label="科二模拟学时学时" width="150" align="center">
                </el-table-column>
                <el-table-column prop="k3mnxs" label="科三模拟学时学时" width="150" align="center">
                </el-table-column>
                <el-table-column prop="time" label="最近更新" width="120" align="center">
                </el-table-column>
            </el-table>
        </div>
        <!-- 分页 -->
        <div class="pagin">
            <el-pagination background :current-page="initParams.page" :page-sizes="[20, 50, 100, 150]"
                :page-size="initParams.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"
                @size-change="handleSizeChange" @current-change="handleCurrentChange" />
        </div>

    </div>
</template>

<script>
/**
* @author        Yng
* @time          2023-11-06 11:10:53  星期一
* @description   学时查询
**/

import { StudentAPI } from '@/api/adminstare'
export default {
    name: 'CHourInquiry',
    data() {
        return {
            form: {
                synthesis: "",
                region: "",
                name: ""
            },
            checked: false,
            options: [{
                value: '选项1',
                label: '黄金糕'
            }, {
                value: '选项2',
                label: '双皮奶'
            }, {
                value: '选项3',
                label: '蚵仔煎'
            }, {
                value: '选项4',
                label: '龙须面'
            }, {
                value: '选项5',
                label: '北京烤鸭'
            }],
            value: '',
            tableData: [],
            // 初始化参数
            initParams: {
                page: 1,
                pageSize: 20,
                action: 'k1234List'
            },
            // 分页总条数
            total: 0,
        }
    },
    methods: {
        async getListData() {
            const result = await StudentAPI(this.initParams)
            console.log('ress', result);

            this.total = result.total

            this.tableData = result.data
        },
        // 当前显示的条数 发生改变时触发
        handleSizeChange(pageSize) {
            this.initParams.pageSize = pageSize || 20
            this.getListData()
        },
        // 当前页码发生改变时触发
        handleCurrentChange(page) {
            this.initParams.page = page || 1
            this.getListData()
        },
    },
    mounted() {
        this.getListData()
    }
}
</script>

<style lang="scss" scoped></style>